// 配置路由
import { createRouter, createWebHistory } from 'vue-router'

//@ts-expect-error 进度条组件
import nprogress from 'nprogress'
import 'nprogress/nprogress.css'
import useUserStore  from '@/stores/modules/user'



// 创建路由
const router = createRouter({
    // 路由模式
    history: createWebHistory(),
    // 路由配置
    routes: [
        {
            path: '/',
            name: 'Layout',
            component: () => import('@/views/Layout/index.vue'),
            children:  [

                {
                    path: '/',
                    name: 'Home',
                    component: () => import('@/views/Home/index.vue'),
                    meta: {
                        title: '首页',
                        icon: 'HomeFilled' ,
                        hidden: false
                    }
                },
                {
                    path: '/screen',
                    name: 'Screen',
                    meta: {
                        title: '数据大屏',
                        icon: 'Platform' ,
                        hidden: false
                    },
                    redirect: '/data-video',
                },
                {
                    path: '/permission',
                    name: 'Permission',
                    meta: {
                        title: '权限管理',
                        icon: 'Lock',
                        hidden: false
                    },
                    redirect: '/permission/user',
                    children: [
                        {
                            path: '/permission/user',
                            name: 'User',
                            meta: {
                                title: '用户管理',
                                hidden: false,
                                icon: 'User'
                            },
                            component: () => import('@/views/Permissions/User.vue'),
                        },
                        {
                            path: '/permission/role',
                            name: 'Role',
                            meta: {
                                title: '角色管理',
                                hidden: false,
                                icon: 'UserFilled'
                            },
                                
                            component: () => import('@/views/Permissions/Role.vue'),
                        },
                        {
                            path: '/permission/menu',
                            name: 'Menu',
                            meta: {
                                title: '菜单管理',
                                hidden: false,
                                icon: 'Menu'
                            },
                            component: () => import('@/views/Permissions/Menu.vue'),
                        },
                    ]
                },
                {
                    path: '/product',
                    name: 'Product',
                    meta: {
                        title: '产品管理',
                        icon: 'ShoppingBag'
                    },
                    redirect: '/brand',
                    children: [
                        {
                            path: '/brand',
                            name: 'Brand',
                            meta: {
                                title: '品牌管理',
                                icon: 'ShoppingCartFull' ,
                                hidden: false
                            },
                            component: () => import('@/views/Product/Brand.vue')
                        },
                        {
                            path: '/attribute',
                            name: 'Attribute',
                            meta: {
                                title: '属性管理',
                                icon: 'ChromeFilled' ,
                                hidden: false
                            },
                            component: () => import('@/views/Product/Attribute.vue')
                        },
                        {
                            path: '/spu',
                            name: 'Spu',
                            meta: {
                                title: 'SPU管理',
                                icon: 'Calendar' ,
                                hidden: false
                            },
                            component: () => import('@/views/Product/Spu.vue')
                        },
                        {
                            path: '/sku',
                            name: 'Sku',
                            meta: {
                                title: 'SKU管理',
                                icon: 'Help' ,
                                hidden: false
                            },
            
                            component: () => import('@/views/Product/Sku.vue')
                        },
                    ]
                }
    
    ]
        },
        {
            path: '/login',
            name: 'Login',
            component: () => import('@/views/Login/index.vue')
        },
        {
            path: '/:pathMatch(.*)*',
            name: 'NotFound',
            component: () => import('@/views/404/index.vue')
        },
        {
            path: '/data-video',
            name: 'DataVideo',
            meta: {
                title: '数据大屏',
                icon: 'Platform' ,
                hidden: false
            },
            component: () => import('@/views/DataVideo/index.vue')
        },
    ],
    // 路由滚动行为
    scrollBehavior: () => ({ left: 0, top: 0 })
   
    
})

// 需要登录权限的路由组件
const whiteList = ['/', '/data-video', '/permission/user', '/permission/role', '/permission/menu','/brand','/attribute','/spu','/spu']



// 路由前置守卫
router.beforeEach((to, from, next) => {
    nprogress.start()

    // 用户数据仓库对象
    const userStore = useUserStore()
    // 获取token
    const token = userStore.token
    // 判断当前跳转路径是不是需要登录权限的
    if(whiteList.includes(to.path)) {
        !token && next({path: '/login'})
        token && next()
    } 
    next()
})



// 路由后置守卫
router.afterEach(() => {
    nprogress.done()
})
// 默认导出
export default router